<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <!--通知IE采用其支持的最新模式-->
    <meta http-equiv="X-UA-COMPATIBLE" CONTENT="IE=EDGE"/>
    <link rel="stylesheet" href="css/bootstrap.min.css"/>
    <title></title>
    <style>

        .login{
            width:45rem;
            height:35rem;
            background:#fff;
            padding:2rem;
            position:fixed;
            top:50%;
            left:50%;
            transform: translate(-50%,-50%);
            border-radius: 2rem;
            -webkit-box-shadow:1px 2rem 5rem #000;
        }

        @media screen and (max-width: 640px) {
            body,html{
                width:100%;
                margin:auto;
            }
            .login{
                width:26rem;
                height:26rem;
                background:#fff;
                padding:2rem;
                position:fixed;
                top:50%;
                left:50%;
                transform: translate(-50%,-50%);
                border-radius: 2rem;
                -webkit-box-shadow:1px 2rem 5rem #000;
            }
        }




    </style>
</head>
<body style="background:#999"oncontextmenu='self.event.returnValue=false' onselectstart="return false">
<div class="container">

            <div class="login">
                <form class="form">
                    <h3 class="text-center">后台管理系统</h3>
                    <div class="form-group has-success has-feedback">
                        <label for="user">用户名</label>
                        <input class="form-control" id="user" type="text"  placeholder="请输入用户名"/>
                        <span class="glyphicon glyphicon-ok form-control-feedback"></span>
                        <!--form-control 垂直的表单-->
                    </div>
                    <div class="form-group has-error">
                        <label for="pass">密码</label>
                        <input class="form-control" id="pass" type="text"  placeholder="请输入密码"/>
                    </div>
                    <div class="checkbox">
                        <label for="check">
                            <input id="check" type="checkbox"/>请记住我
                        </label>
                    </div>
                    <button type="submit" class="form-control btn btn-success">提交</button>
                </form>
            </div>


</div>

<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
      /*阻止右键菜单的默认*/
        function click(){
            if(event.button==2){
                alert( '本网站欢迎您 !!');
            }
        }
        document.onmousedown = click;
</script>
</body>
</html>